/* 整个页面的基本字体设置 */
body {
    font-family: Arial, sans-serif; /* 使用Arial字体，如果没有则使用系统默认的无衬线字体 */
    margin: 0; /* 移除默认的外边距 */
    padding: 0; /* 移除默认的内边距 */
  }
  
  /* 头部区域的样式 */
  header {
    background-color: #fefbfb; /* 浅灰色背景 */
    color: rgb(12, 12, 12); /* 文字颜色为深灰色 */
    padding: 1rem; /* 内边距为1rem */
    display: flex; /* 使用弹性盒子布局 */
    justify-content: space-between; /* 子元素分散对齐 */
    align-items: center; /* 垂直居中对齐 */
  }
  
  /* 导航栏无序列表的样式 */
  nav ul {
    list-style-type: none; /* 移除列表项的默认标记 */
    margin: 0; /* 移除默认的外边距 */
    padding: 0; /* 移除默认的内边距 */
    display: flex; /* 使用弹性盒子布局 */
  }
  
  /* 导航栏列表项的样式 */
  nav ul li {
    margin-right: 1rem; /* 右边距为1rem */
  }
  
  /* 导航栏链接的样式 */
  nav ul li a {
    color: rgb(16, 16, 16); /* 文字颜色为深灰色 */
    text-decoration: none; /* 移除下划线 */
  }

  /* 低高度图片的样式 */
.low-height-image {
    width: 100%; /* 图片宽度铺满整个容器 */
    height: 15px; /* 设置图片高度 */
    object-fit: cover; /* 保持图片比例，裁剪超出部分 */
  }

  .search-bar {
    margin: 20px;
  }
  
  .search-bar input[type="text"] {
    padding: 10px;
    width: 200px;
    border: 1px solid #ccc;
    border-radius: 5px;
  }
  
  .video-section {
    text-align: center;
    margin: 20px auto; /* 设置为auto以在水平方向上居中 */
    max-width: 1100px; /* 最大宽度 */
    padding: 0 20px; /* 可选，为内容添加内边距 */
    box-sizing: border-box; /* 确保内边距和边框包含在宽度内 */
  }
  
  .video-section video {
    width: 100%;
    max-width: 100%; /* 确保视频宽度不超过其容器的宽度 */
  }
  
  .content {
    padding: 20px;
  }
  
  .learner-type-section {
    padding: 40px;
    text-align: center;
}

.learner-type-images {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.learner-type-image img {
    border-radius: 50%;
}

.learner-type-image span {
    display: block;
    margin-top: 10px;
}

  .content h3 {
    text-align: center;
    margin-bottom: 20px; /* 可根据需要调整标题与下方内容之间的间距 */
  }